// pages/song/song.js
import req from "../../utils/req.js";

// 获取全局唯一的小程序实例
const appInstance = getApp();

Page({
  /**
   * 页面的初始数据
   */
  data: {
    songObj: {},
    songId: "",
    musicUrl: "",
    isplay: false,
  },

  // 用于绑定背景音频管理器相关事件
  addEvent() {
    // 监听背景音频播放事件
    this.backgroundAudioManager.onPlay(() => {
      // 播放的时候将小程序中的实例改为true
      appInstance.globalData.playState = true;

      // 将data中的状态也改为true
      this.setData({
        isplay: true,
      });
    });

    // 监听背景音频暂停事件
    this.backgroundAudioManager.onPause(() => {
      // 播放的时候将小程序中的实例改为true
      appInstance.globalData.playState = false;

      // 将data中的状态也改为true
      this.setData({
        isplay: false,
      });
    });
  },

  // 用于监视用户对播放按钮的点击操作，用于控制音乐播放
  handlePlay() {
    // 播放对应歌曲
    // 1.生成全局唯一的背景音频管理器
    // const backgroundAudioManager = wx.getBackgroundAudioManager();

    // 判断当前页面的播放状态
    if (this.data.isplay) {
      // 处于播放状态的时候，进入这里
      // 暂停当前音频
      this.backgroundAudioManager.pause();

      // 将小程序中的state也改为false
      appInstance.globalData.playState = false;
    } else {
      // 处于暂停状态的时候，才能进入这里
      // 播放当前音频

      // 必须要输入src/title，告知即将播放的音频链接和标题
      this.backgroundAudioManager.src = this.data.musicUrl;
      this.backgroundAudioManager.title = this.data.songObj.name;

      // 第一次进入一定是播放按钮，所以在这里将当前歌曲的ID保存起来
      appInstance.globalData.audioId = this.data.songId;
      // 将小程序中的state也改为true
      appInstance.globalData.playState = true;
    }

    // 让页面播放的C3效果停下来或者动起来
    this.setData({
      isplay: !this.data.isplay,
    });
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: async function (options) {
    // 小程序只能传递query参数,并且在onLoad生命周期的形参中会生成query对象
    // 小程序url有长度限制
    // console.log(options)

    // 获取对应的歌曲id
    const { songId } = options;

    //发送请求获取歌曲详细信息
    const result = await req("/song/detail", { ids: songId });
    const songObj = result.songs[0];
    // console.log(result)
    // 动态设置当前页面的导航栏标题
    wx.setNavigationBarTitle({
      title: songObj.name,
    });

    this.setData({
      songObj,
      songId,
    });

    // 获取歌曲详情
    const { data } = await req("/song/url", { id: songId });
    const musicUrl = data[0].url;
    this.setData({
      musicUrl,
    });

    // 判断背景音乐是否在播放
    // 判断两首歌是不是一首歌
    const { audioId, playState } = appInstance.globalData;
    if (playState && songId === audioId) {
      // 如果能进来说明歌曲正在播放，而且是正在播放的歌曲
      this.setData({
        isplay: true,
      });
    }

    // 将背景音频管理器相关的事件监听绑定在事件实例上
    this.backgroundAudioManager = wx.getBackgroundAudioManager();
    // 监听背景音频是否在播放
    this.addEvent();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {},
});
